<!-- 二手房源 -->
<template>
	<view>
		<!-- 自定义顶部导航 -->
		<u-navbar :safeAreaInsetTop="true" bgColor="transparent">
			<view slot="left" class="u-flex">
				<!-- regionShow = true -->
				<view class="u-flex m-flex-no u-flex-y-center u-m-r-30" @click="nextNav('/pages/room/search?type=2')">
					<u-icon name="dingwei" customPrefix="master" size="18"></u-icon>
					<view class="u-m-l-10">{{ city }}</view>
				</view>
				<view class="u-flex-1">
					<u-search placeholder="你想找哪里呢？" bgColor="#fff" v-model="keyword" :show-action="false" @click="nextNav('/pages/room/search?type=2')" :disabled="true"></u-search>
				</view>
			</view>
		</u-navbar>
		<view class=""><u-swiper :list="bannerlist" radius="0" height="215" keyName="image"></u-swiper></view>
		<view class="u-rela">
			<view class="u-abso m-mg-lr boxleft">
				<view class="u-flex u-flex-between m-bg-w boxleft1">
					<view class="u-p-l-60 u-p-r-60" v-for="(item, index) in list0" :key="index" @click="goyan(item.URL)">
						<view class=""><u--image :src="item.src" width="62" height="84"></u--image></view>
						<view class="u-m-t-20">
							<text class="u-p-l-20 u-p-r-20">{{ item.name }}</text>
						</view>
					</view>
				</view>
				<view class="u-flex u-flex-between u-m-t-30">
					<view class="w_40 m-bg-w m-card u-flex" v-for="(item, index) in list2" :key="index" @click="nextNav(item.url)">
						<view><u--image :src="item.src" width="55" height="48" mode="aspectFit"></u--image></view>
						<view class="u-m-l-30">
							<text>{{ item.name }}</text>
						</view>
					</view>
				</view>
				<view class="u-m-t-30 m-card">
					<view class="u-flex u-flex-center"><u--image :src="src" width="240" height="120" radius="0"></u--image></view>
					<!-- <view class="boxblue u-m-t-30">
						<text>交易流程图</text>
					</view> -->
					<view class="u-flex u-flex-center"><u--image :src="src1" width="300" height="675" radius="0" mode="aspectFit"></u--image></view>
				</view>
				<view :style="{ height: 55 + sys.bottom + 'px' }"></view>
			</view>
		</view>
		<u-picker :show="regionShow" keyName="name" :columns="[getcity]" @cancel="regionShow = false" @confirm="confirm"></u-picker>
		<tabbar ref="tabbar" @newObj="newObj"></tabbar>
		<obtain :show="obtain" @showchange="obtain = false"></obtain>
		<u-loading-page loading-text="内当家APP" :loading="pageLoad"></u-loading-page>
	</view>
</template>

<script>
export default {
	data() {
		return {
			regionShow: false,
			list0: [
				{
					name: '我要买房',
					src: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/maifang.png',
					URL: '/pages/handhousing/buyahouse'
				},
				{
					name: '我要卖房',
					src: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/buyhouse.png',
					// URL: '/pages/mine/shangchuan'
					URL: '/pages/handhousing/guarantee?type=0'
				}
			],
			list2: [
				{
					name: '帮我找房',
					src: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/ZAHOFANG%403x.png',
					url: '/pages/room/helpRoom?type=11'
				},
				{
					name: '地图找房',
					src: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/ditu%403x.png',
					url: '/pages/room/mapRoom?type=12'
				}
			],
			city: '',
			getcity: [],
			bannerlist: [],
			src: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/636903bf2a3bb296b0bbfd41325f537.png',
			src1: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/ershoufang.png'
		};
	},
	async onLoad() {
		this.getcity = await this.require('getcity');
		this.city = this.getcity[0] ? this.getcity[0].name : '东莞市';
		let city = uni.getStorageSync('city');
		if (city) {
			this.city = city;
		}
		this.bannerlist = await this.require('bannerlist');
		if (this.pageLoad) {
			setTimeout(() => {
				this.pageLoad = false;
			}, 1000);
		}
	},
	methods: {
		async confirm(e) {
			this.city = e.value[0].name;
			this.params = {
				p: 1,
				pnum: this.pnum,
				city: this.city
			};
			await this.getList();
			this.regionShow = false;
		},
		async goyan(url) {
			if (url == '/pages/handhousing/guarantee') {
				if (!(await this.getMobile())) {
					return;
				}
			}
			this.nextNav(url, 1);
		}
	}
};
</script>

<style lang="scss" scoped>
.boxblue {
	border-left: 6rpx solid #0e5642;
	padding-left: 15rpx;
	font-size: 30rpx;
	font-weight: bold;
}

.boxleft {
	top: -30rpx;
	left: 0;
	right: 0;
}

.boxleft1 {
	padding: 30rpx;
	border-radius: 10rpx;
	color: #211f20;
	font-size: 24rpx;
}

.w_40 {
	width: 48%;
	align-items: center;
	font-size: 24rpx;
	color: #211f20;
}
</style>
